export function useDateTimePicker() {
  const selectedDate = ref(DuUtil.DatetoYYYYMM(new Date())) // 确定后的选中时间
  const showPop = ref(false) // 包裹picker组价的pop

  const pickerDate = ref(new Date()) // picker组件中v-model绑定的时间

  const formatterYMD = (type, val) => {
    if (type === 'year') {
      return `${val}年`
    }
    if (type === 'month') {
      return `${val}月`
    }
    if (type === 'day') {
      return `${val}日`
    }
    return val
  }
  const minDate = new Date(2020, 0, 1)
  const maxDate = new Date()

  // 确定
  const onConfirm = () => {
    selectedDate.value = DuUtil.DatetoYYYYMM(pickerDate.value)
    showPop.value = false
  }
  // 取消
  const onCancel = () => {
    pickerDate.value = new Date(selectedDate.value)
    showPop.value = false
  }

  return {
    selectedDate,
    showPop,
    pickerDate,
    minDate,
    maxDate,
    formatterYMD,
    onConfirm,
    onCancel,
  }
}

export function useRangeDateTimePicker() {
  const selectedStartDate = ref(DuUtil.DatetoYYYYMM(new Date())) // 确定后的选中时间
  const selectedEndDate = ref(DuUtil.DatetoYYYYMM(new Date())) // 确定后的选中时间

  const showStartPop = ref(false) // 包裹picker组价的开始时间pop
  const showEndPop = ref(false) // 包裹picker组价的结束时间pop

  const pickerStartDate = ref(new Date()) // picker组件中v-model绑定的开始时间
  const pickerEndDate = ref(new Date()) // picker组件中v-model绑定的结束时间

  const formatterYMD = (type, val) => {
    if (type === 'year') {
      return `${val}年`
    }
    if (type === 'month') {
      return `${val}月`
    }
    if (type === 'day') {
      return `${val}日`
    }
    return val
  }
  const minDate = new Date(2020, 0, 1)
  const maxDate = new Date()

  // 确定
  const onStartConfirm = () => {
    selectedStartDate.value = DuUtil.DatetoYYYYMM(pickerStartDate.value)
    showStartPop.value = false
  }
  const onEndConfirm = () => {
    selectedEndDate.value = DuUtil.DatetoYYYYMM(pickerEndDate.value)
    showEndPop.value = false
  }
  // 取消
  const onStartCancel = () => {
    pickerStartDate.value = new Date(selectedStartDate.value)
    showStartPop.value = false
  }
  const onEndCancel = () => {
    pickerEndDate.value = new Date(selectedEndDate.value)
    showEndPop.value = false
  }

  return {
    selectedStartDate,
    selectedEndDate,
    showStartPop,
    showEndPop,
    pickerStartDate,
    pickerEndDate,
    minDate,
    maxDate,
    formatterYMD,
    onStartConfirm,
    onEndConfirm,
    onStartCancel,
    onEndCancel,
  }
}
